{% extends "libsys/base/base_page.html" %}
{% load staticfiles %}
{% block header_script %}
    <script type="application/x-javascript"> addEventListener("load", function () {
        setTimeout(hideURLbar, 0);
    }, false);

    function hideURLbar() {
        window.scrollTo(0, 1);
    } </script>
{% endblock %}

{% block content %}
    <!-- banner -->
    <div class="banner-1">
    </div>
    <!-- //banner -->
    <!-- team -->
    <div class="team agileits-w3layouts">
        <div class="container">
            <div class="w3ls-title">
                <h3 class="agileits-title w3title1">{{ page_name }}</h3>
            </div>
            {% for book1,book2 in books %}
            <div class="team-info wthree">
                <div class="col-md-6 team-w3lsgrids">
                    <div class="team-left">
                        <img class="img-responsive" src="{% static 'libsys/book_image/5811adaeN150186c5.jpg' %}" alt="">
                    </div>
                    <div class="team-right">
                        <h4>{{ book1.name }}</h4>
                        <p>{{ book1.author }} </p>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <div class="col-md-6 team-w3lsgrids">
                    <div class="team-left">
                        <img class="img-responsive" src="{% static 'libsys/book_image/5811adaeN150186c5.jpg' %}" alt="">
                    </div>
                    <div class="team-right">
                        <h4>{{ book2.name }} </h4>
                        <p>{{ book1.author }} </p>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <div class="clearfix"></div>
            </div>
            {% endfor %}
        </div>
    </div>
    <!-- //team -->
{% endblock %}